<script setup>
    import { ref,toRefs,reactive, onMounted,computed} from 'vue'
    import { Plus } from '@element-plus/icons-vue'
    
    const props = defineProps({
        images:Array
    });

	const imageLists = ref(props.images);
    const handleSuccess = (response,uploadFile)  => {
        if(imageLists.value instanceof Array) {
            imageLists.value.push(response.data.url);
        } else {
            console.log('imageLists:',imageLists);
        }
    }

    defineExpose({
        imageLists
    })
    </script>
    <template>
            <template  v-for="(img,key) in imageLists" :key="key">
				 <el-image style="width: 100px; height: 100px" :src="img" :fit="fit" />
            </template>
          
         <el-upload
              class="avatar-uploader"
              action="/api/admin/file/upload"
              :show-file-list="false"
              :on-success="handleSuccess"
            >
              <el-icon  class="avatar-uploader-icon"><Plus /></el-icon>
            </el-upload>
    </template>